<template>
  <div>
    <input type="button" value="减少" @click="$store.state.count--">
    <input type="button" value="增加" @click="add">
    <br>
    <input type="text" v-model="$store.state.count">
  </div>
</template>

<script>
export default {
  data() {
    return {
      // count: 0
    };
  },
  methods: {
    add() {
      // 千万不要这么用，不符合 vuex 的设计理念  如果所有组件内部都能操作store中数据 可能会导致操作数据错误  不方便后期维护和扩展
      // this.$store.state.count++;
      this.$store.commit('increment');
      // console.log(this);
    },
    remove() {
      // this.$store.commit('substract', 4);
      this.$store.commit("substract", { c: 3, d: 1 });
    }
  },
  computed:{
    fullname: {
      get(){}, // 只负责向外提供数据
      set(){} // 只负责向咱们写数据
    }
  }
};
</script>

<style lang="scss" scoped>

</style>
